<template>
	<view>
		<view class="tips-content">
			<image src="../../static/imgs/mnemonic-tips.png" mode="widthFix" lazy-load></image>
			<view class="tips-title">
				<view>{{i18n.Backup_tips}}</view>
				<text>{{i18n.define_mnemo_tip3}}</text>
			</view>
			<view class="tips-con">
				<view class="tips-con-i">
					{{i18n.define_mnemo_tip1}}
				</view>
				<view class="tips-con-i">
					{{i18n.define_mnemo_tip2}}
				</view>
			</view>
			
		</view>
		<view class="tips-bottom-button">
			<button hover-class="active" @tap.stop="jump">{{i18n.Create_now}}</button>
		</view>
	</view>
</template>

<script>
	import uniNavBar from '../../components/uni-nav-bar/uni-nav-bar.vue';
	import uniStatusBar from '@/components/uni-status-bar/uni-status-bar.vue';
	import {mapGetters, mapMutations} from 'vuex'
	import Load from '../../components/common/load.vue';
	import {pageto, showToast, fetch, forceUpdate} from '@/common/js/util.js'
	export default {
		components:{
			
		},
		data() {
			return {
				
			};
		},
		computed: {
			i18n() {
				return this.$t('message')
			},
			...mapGetters([
				'getRequestUrl',
				'getLang',
				'getIncode',
				'getLoginInfo',
				'getLogin',
				'getLangType'
			])
		},
		methods:{
			jump(){
				console.log('111');
				uni.navigateTo({
					url:'/pages/new-login/define-Mnemonic'
				})
			}
		}
	}
</script>

<style lang="scss">
	.tips-bottom-button{
		position: fixed;
		width: 690upx;
		left: 30upx;
		bottom: 100upx;
		button{
			width: 690upx;
			line-height: 88upx;
			height: 88upx;
			color: #FFFFFF;
			background-color: #26375b;
			&.active{
				transform: scale(.9);
				opacity: .9;
			}
		}
	}
	.tips-content{
		padding: 50upx 58upx;
		image{
			width: 276upx;
			height: 276upx;
			flex-shrink: 0;
			margin-left:50%;
			transform: translateX(-50%);
		}
		.tips-title{
			border-bottom: 1upx solid #BEBEBE;
			margin-bottom: 22upx;
			view{
				color: #141414;
				font-weight: bold;
				font-size: 32upx;
			}
			text{
				color: #535353;
				font-size: 26upx;
				line-height: 112upx;
			}
		}
		.tips-con{
			.tips-con-i{
				color: #535353;
				font-size: 26upx;
				padding-left: 54upx;
				position: relative;
				&::before{
					content: "";
					position: absolute;
					width: 8upx;
					height: 8upx;
					background-color: #26375b;
					border-radius: 4upx;
					left: 0;
					top: 50%;
					transform: translateY(-50%);
				}
				&:first-of-type{
					margin-bottom: 48upx;
				}
			}
		}
	}
</style>
